import React from 'react';
import {routerShape} from 'react-router';
import { inject, observer } from 'mobx-react';
import { WeaErrorPage, WeaTools,WeaLocaleProvider,WeaTop,WeaRightMenu} from 'ecCom';
import FnaPermission from '../../public/FnaPermission';
import {getPrimaryButton} from '../../public/FnaButton';
import {obj2UrlParam} from '../../util/pulic-func';
import {WeaTableNew} from 'comsMobx'
const { WeaTable } = WeaTableNew
const getLabel = WeaLocaleProvider.getLabel;

/**
 * 展示报表
 */
@inject('showReportStore')
@observer
class ShowReport extends React.Component {
	static contextTypes = {
        router: routerShape
	}
	
	constructor(props) {
		super(props);
	}

	componentDidMount() {
		const { showReportStore } = this.props;
		const { getShowList } = showReportStore;  
		
		let params = {};
		for (let i = 0; i < window.sessionStorage.length; i++) {
			params[window.sessionStorage.key(i)] = window.sessionStorage.getItem(window.sessionStorage.key(i));
			// console.log(window.sessionStorage.key(i)+":"+window.sessionStorage.getItem(window.sessionStorage.key(i)));
		}

		getShowList(params);
	}
	
	componentWillReceiveProps(nextProps) {
		
	}
	
	shouldComponentUpdate(nextProps, nextState) {
		
		return true;
	}

	componentWillUnmount() {
		//组件卸载时一般清理一些状态
		window.sessionStorage.clear();
	}

	render() {
		const { showReportStore } = this.props;
		const { reportName } = this.props.location.query;
		const { loading,hasRight,tableStore } = showReportStore;                                                                                                                                                                                                                                                                    
		let title = <span><span>{reportName}</span></span>;

		return (
			<div style={{height: '100%'}}>
			  {hasRight == 1 && <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@p7pyec`} 
			  	datas={this.getRightMenu()}
			  	collectParams={{favname:reportName, favouritetype:5}}
			   >
				<WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@two3lw`}
					title={title}
					loading={loading}
					icon={<i className='icon-coms-Finance'/>}
					iconBgcolor='#f14a2d'
					buttons={this.getTopRightButton(this.props.ecId || '')}
					buttonSpace={10}
					showDropIcon={true}
					dropMenuDatas={this.getRightMenu()}
				>
				<WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@bv0qha`} 
                    comsWeaTableStore={tableStore}
                    onOperatesClick={this.operator}
                    getColumns={this.getColumnsInfo}
                    hasOrder={true}
                />

                </WeaTop>
             </WeaRightMenu>}
			 {hasRight == 4 && <FnaPermission ecId={`${this && this.props && this.props.ecId || ''}_FnaPermission@qlkajt`}/>}
			</div>
		)
	}
	
	//Top右侧按钮菜单
	getTopRightButton = (ecId) => {
		const { showReportStore } = this.props;
		const { loading } = showReportStore;
		let btns = [];
		btns.push(getPrimaryButton(this.doBackSearCh,loading,getLabel(383659,'重新搜索'),ecId+'_Search_ShowReport'));
		btns.push(getPrimaryButton(this.exportExcel,loading,getLabel(132190,'导出Excel'),ecId+'_ExportExcel_ShowReport'));
		
		return btns;
	}

	/**
	*获取右键菜单
	*/
	getRightMenu = () => {
		const { showReportStore } = this.props;
		const { loading } = showReportStore;
		let btns = [];

    	 btns.push({
	            key:"search",
				icon: <i className='icon-coms-search'/>,
				disabled:loading,
	            content:getLabel(383659,'重新搜索'),
	            onClick:()=>{this.doBackSearCh();}
		 });
		 btns.push({
			key:"export",
			icon: <i className='icon-coms-export'/>,
			disabled:loading,
			content:getLabel(132190,'导出Excel'),
			onClick:()=>{this.exportExcel();}
		});
	    return btns;
	}

	//导出
	exportExcel = () => {
		let params = {};

		for (let i = 0; i < window.sessionStorage.length; i++) {
			params[window.sessionStorage.key(i)] = window.sessionStorage.getItem(window.sessionStorage.key(i));
		}

		let queryParams = obj2UrlParam(params);

		let url = "/api/fnaMulDimensions/report/exportExcel?"+queryParams;
		window.location.href = url;
	}

	//重新搜索
	doBackSearCh = () => {
		const { reportId,accountId,typeIdComb,approvalId,reportName } = this.props.location.query;
		window.sessionStorage.clear();

		this.context.router.push({
            pathname : "/main/fnaMulit/customReport",
            query : {
                reportId : reportId,
				accountIds : accountId,
				typeIdComb : typeIdComb,
				approvalIds : approvalId,
				reportName : reportName
            }
        });
	}

	//操作判断按钮
	operator = (record,index,operate,flag) => {
		const { showReportStore } = this.props;
		let id = record.id;
	}
}


export default WeaTools.tryCatch(React,
	props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@hqgo8t`} msg={ props.error ? props.error : getLabel(385218,'对不起,该页面异常,请联系管理员!')} />,
	{error: ""}
)(ShowReport);




